import req from '@/utils/request'
import {
  ElLoading
} from 'element-plus'

let loading = null

// 封装一个函数式上传文件的方法
let input = null
export const checkFile = () => {
  return new Promise((resolve, reject) => {
    // 创建一个input标签
    if (!input) {
      input = document.createElement('input')
    } else {
      document.body.removeChild(input)
      input = null
      input = document.createElement('input')
    }
    // 设置input的type为file
    input.type = 'file'
    // 设置input的样式为display: none
    input.style.display = 'none'
    // 只能选择一个文件
    input.setAttribute('multiple', false)
    // 文件类型
    input.setAttribute('accept', '.csv')
    // 将input添加到body中
    document.body.appendChild(input)
    // 监听input的change事件
    input.addEventListener('change', () => {
      // 获取input的files属性
      const files = input.files
      // 判断是否有文件
      if (files.length) {
        // 有文件则调用resolve方法并传入文件
        resolve(files[0])
      } else {
        // 没有文件则调用reject方法
        reject(new Error('No file selected'))
      }
      // 移除input
      document.body.removeChild(input)
      input = null
    })
    // 触发input的click事件
    input.click()
  })
}
export const uploadFile = async () => {
  try {
    const file = await checkFile()

    loading = ElLoading.service({
      lock: true,
      text: '数据加载中，请稍后...',
      background: 'rgba(0, 0, 0, 0.7)'
    })
    // 创建一个FormData对象
    const formData = new FormData()
    // 将文件添加到formData中
    formData.append('file', file)
    // 调用req方法上传文件
    const res = await req.post('/loadData', formData, {
      headers: {
        "Content-Type": "multipart/form-data"
      },
    })
    // const res = await req({
    //   url: '/loadData',
    //   method: 'post',
    //   formData,
    //   headers: {
    //     'Content-Type': 'multipart/form-data'
    //   },
    //   timeout: 0
    // })
    loading.close()
    return Promise.resolve(res)
  } catch (error) {
    loading.close()
    return Promise.reject(error)
  }
}